
<extend name="Public/layout"/>
<block name="head">
<script src="__PUBLIC__js/index-new.js"></script>
          <script src="__PUBLIC__js/video-info.js"></script>
<link rel="stylesheet" href="__PUBLIC__css/video-info.css?a=<php>echo time()</php>">
<script src="__PUBLIC__assets/ckplayer/ckplayer.js"></script>
<style type="text/css">
.footer{
    display: none;
}
</style>
</block>
    
   <block name="main">

    <div class="header">
      <div class="video">
       <div id="a1" <notempty name="info[wx_pic]"> pic="{$info.wx_pic}" <else/> pic="{$info.pic}" </notempty> video_id="{$info.video_id}" info_id="{$info.id}" video="{$info.hd_url}"></div>
      </div>
    </div>
    
    <div class="container">
      <div class="video-info">
        <div class="detail">
         <span></span><h4>{$info.title}</h4>
          <p class="video-detail">视频简介</p>
        </div>
        <div class="type">
        <notempty name="info.host_arr.0.host_name">
         <div class="author">
            <p>主持人</p>
            <foreach name="info.host_arr" item="v">
               <p>{$v.host_name}</p>
            </foreach>
          </div>
        <else/>
           <div class="author">
                    <p>主持人</p>
                    <foreach name="info.host_arr" item="v">
                       <p>暂无</p>
                    </foreach>
          </div>
        </notempty>


        <notempty name="info.lable_name.0">
        <foreach name="info.lable_name" item="v">
          <span>{$v}</span>
        </foreach>

      </notempty>
          <a href="#">{$info.add_time|date="Y年m月d日",###}</a>
        </div>
      </div>
<!-- 视频 -->
      <div class="related">
        <div class="re-header">
          <h4>相关视频</h4>
        </div>
        <ul class="re-wrapper">
            <volist name="play_list" id="v" offset="0" length='3'>

                  <li>
                     <a href="/Home/Video/video_info/id/{$v.id}/type/2">
                        <div class="re-item-left">
                           <img <notempty name="v[wx_pic]">src="{$v.wx_pic}" <else/>src="{$v.pic}"</notempty> height="146" width="234">
                        </div>
                        <div class="re-item-right">
                            <h4>{$v.title}</h4>
                            <div class="re-item-right-wrapper">
                                <span>播放：{$v.push_play}</span>
                                <span>{$v.add_time|date="Y-m-d",###}</span>
                            </div>
                            <span></span>
                        </div>
                    </a>
                </li>
            </volist>
        </ul>
      </div>
      <div class="re-all">
        <span>全部</span>
      </div>
<!-- 网友评论 -->
      <div class="comment">
        <div class="comment-title">
          <h4>网友评论</h4>
        </div>
        <div class="comment-pub">
          <a class="comment-user">
            <if condition="$_SESSION['user']['id'] gt 0">
            <img src="{$_SESSION['user']['url_img']}">
                <else/>
            <img src="__PUBLIC__images/user.png">
            </if>
          </a>
          <div class="comment-inp" attr_type="1"  onclick="comments_tab(this,0)"  value ="我要说两句" >
            <p>我要说两句</p>
          </div>
        </div>
        <div class="comment-wrapper">
          <ul id="pl_con">
            <foreach name="comments" item="v">
            <li class="comment-item" attr_id="{$v.id}">
              <div class="item-top">
                <div class="item-right">
                  <img src="{$v.user.url_img}">
                  <div class="user">
                    <h4>{$v.user.nickname}</h4>
                    <p>{$v.add_date}</p>
                  </div>
                </div>
               <div class="item-left">
                <if condition="$v.praise gt 0">
                  <div class="item-good">
                    <img src="__PUBLIC__images/comment-good.png" height="26" width="28">
                <else/>
                  <div class="item-no" onclick="comment_praise({$v.id},this)">
                    <img src="__PUBLIC__images/comment-no.png" height="26" width="28">
                </if>
                    
                    <span>{$v.praise_count}</span>
                  </div>
                  <div class="item-com comments_info" onclick="comments_info(this,{$v.praise_count},{$v.comment_count})">
                    <img src="__PUBLIC__images/comment.png" height="25" width="28">
                    <span>{$v.comment_count}</span>
                  </div>
                </div>
              </div>
              <div class="item-bottom comments_info" onclick="comments_info(this,{$v.praise_count},{$v.comment_count})">
                <p>{$v.content}</p>
              </div>
            </li>
            </foreach>
    
          </ul>
          
        </div>
      </div>
    
    </div>

<!-- 视频简介 -->
    <div class="video-message">
        <div class="detail">
          <h4>{$info.title}</h4>
          <img class="video-m" src="__PUBLIC__images/arrow-xia.png">
        </div>
        <div class="con">
          <div class="type">
             <notempty name="info.host_arr.0.host_name">
              <foreach name="info.host_arr" item="v">
                  <img src="{$v.host_pic}">
                 <p>{$v.host_name}</p>
              </foreach>
            </notempty>
          </div>
        </div>
      <div class="video-intro">
        <div class="title">
         <h4>视频简介</h4>
        </div>
         <div class="detail"  style="font-size:0.32rem; line-height:0.9rem;">
           <h6>{$info.news_info.title}</h6>
           {$info.news_info.content}
           </div>
        </div>
    </div>
<!-- 相关视频 -->
    <div class="re-video">
      <div class="re-title">
          <h4>相关视频</h4>
          <img class="re-m" src="__PUBLIC__images/bottom.png">
      </div>
      <ul class="re-wrapper">
        <foreach name="play_list" item="v">

             <li>
                     <a href="/Home/Video/video_info/id/{$v.id}/type/2">
                        <div class="re-item-left">
                           <img <notempty name="v[wx_pic]">src="{$v.wx_pic}" <else/>src="{$v.pic}"</notempty> height="146" width="234">
                        </div>
                        <div class="re-item-right">
                            <h4>{$v.title}</h4>
                            <div class="re-item-right-wrapper">
                                <span>播放：{$v.push_play}</span>
                                <span>{$v.add_time|date="Y-m-d",###}</span>
                            </div>
                            <span></span>
                        </div>
                    </a>
                </li>
        </foreach>

        </ul>
    </div>
    </body>
<!-- 评论输入框 -->
<div class="comment-info">
    <div class="comment-title">
          <h4>发表评论</h4>
          <img class="comment-hidden" src="__PUBLIC__images/bottom.png">
    </div>
    <div class="content">
      <textarea class="comment-textarea" cols="5" type="text" maxlength="200" placeholder="说点什么呢..."></textarea>
      <div class="comment-send"  onclick="add_coments(this,1,0,0)">
      <p>发送</p>
      </div>
    </div>
</div>
<!-- 网友详细评论 -->
 <div class="comment-tj">
      <div class="re-title">
          <h4>详情</h4>
          <img class="re-m tj-item" src="__PUBLIC__images/bottom.png">
      </div>
      <div class="comment-wrapper comment-top" id="comments_info">
         
      </div> 

        <div class="comment-pub bottom-item">
            <button class="comment-inp btn" type="button" id="s_comments"  attr_type="2" onclick="comments_tab(this,0)">
                <img src="__PUBLIC__images/comment.png" ><span>0</span>回复
            </button>
            <div class="item-no" id="info_zan">
                <img src="__PUBLIC__images/comment-no.png" ><span>0</span>赞
            </div>
        </div>   
</block>
<script src="__PUBLIC__js/index.js"></script>
<block name="js"> 
    <script type="text/javascript">
      //评论详情
    function comments_info(obj,praise_count,comment_count) {
      console.log(praise_count)
      $('.container').css('display','none');
      $('.comment-tj').css('display','block');
      $('.comment-info').css('display','none');
      var id = $(obj).parents('.comment-item').attr('attr_id');
        $.post('/home/video/get_comments_info',{
          id:id,
        },function(res){
          console.log(res)
          $('#comments_info').html(res.content)
          $('#s_comments').find('span').html(comment_count)
          $('#info_zan').find('span').html(praise_count)
           $('#s_comments').attr('onclick','comments_tab(this,'+id+')')
        })
    };
          // 评论面板
        function comments_tab(obj,id,val) {
            var user_id = "{$_SESSION['user']['id']}"
            if(!user_id){
              layer.open({
                content:'请先登录！'
                ,skin: 'msg'
                ,time: 2
               // ,end:function(){$(obj).parent().parent('.comment-info').css('display','none');}
                ,end:function(){location.href='/Home/user/login'}
                });
              return;
            }
            $('.comment-info').css('display','block');
            var type = $(obj).attr('attr_type');
            console.log(type)
            if(type==1){
              $('.comment-send').attr('onclick',"add_coments(this,1,0,0)")
            }else if (type==2) {
              $('.comment-send').attr('onclick',"add_coments(this,2,"+id+","+id+")")
              
              if(val==1){
                $('.comment-pub').css('display','none')
              }else{
                $(obj).parent().css('display','none')
              }
              
            }
        };

    $('.comment-hidden').click(function(){
        $('.comment-info').css('display','none');
        $('.bottom-item').css('display','block');
    });
  
    //发表评论
    function add_coments(obj,type,id_parent,pid){

      if(!id_parent){
          var id_parent=0;
      }
      var id_target = "{$_GET['id']}";

      var content = $(obj).prev('Textarea').val();
      if(!content){
          layer.open({
            content:'请输入评论内容！'
            ,skin: 'msg'
            ,time: 1
          });
                   return;
      }
    $.post('{:U("comment/add_coments")}',{
        content:content,
        id_parent:id_parent,
        type:2,
        id_target:id_target,
        p_id:pid,
        target_title:'{$info.title}',
    },function(res){
        if(res.err==0){
            $(obj).prev().val('');
            //ajax 无刷新添加评论
            if(type==1){
                 layer.open({
                content: res.msg
                ,skin: 'msg'
                ,time: 1
               // ,end:function(){$(obj).parent().parent('.comment-info').css('display','none');}
                ,end:function(){location.reload()}
                });
            }else{
                layer.open({
                    content: res.msg
                    ,skin: 'msg'
                    ,time: 1
                   ,end:function(){
                    $(obj).parent().parent('.comment-info').css('display','none');
                    $('.comment-pub').css('display','block');
                 }
                });
            }

            if(type==2){
                var h='';
                h+='<li class="comment-item  item-next" >'
                h+='<div class="item-top">'
                h+='<div class="item-right">'
                h+='<img src="{$_SESSION["user"]["url_img"]}">'
                h+='<div class="user">'
                h+='<h4>{$_SESSION["user"]["nickname"]}</h4>'
                h+='<p>刚刚</p>'
                h+='</div></div><div class="item-left">'
                h+='<div class="item-no" onclick="comment_praise('+res.id+',this)">'
                h+='<img src="__PUBLIC__images/comment-no.png" height="26" width="28">'
                h+='<span>0</span></div>'
                h+='<div class="item-com comments_info" attr_type="2"  onclick="comments_tab(this,'+res.id+',1)">'
                h+='<img src="__PUBLIC__images/comment.png" height="25" width="28">'
                h+='<span>评论</span>'
                h+='</div></div></div><div class="item-bottom">'
                h+='<p>'+content+'</p></div> </li>'

                $('#hf_con').prepend(h)
                var comment_num_count = parseInt($("#s_comments").find('span').text())+1
                $("#s_comments").find('span').text(comment_num_count)
            }
           
        }else{
            layer.msg(res.msg)
        }
        
    })
}
        var p=1;
        var is_data=1;
         
            $(window).scroll(function() {
              if(is_data==1){
              if($(document).scrollTop()==$(document).height()-$(window).height()){
                $('.loading').css('display','block');
                  setTimeout(function(){get_more_comment(p)},500)
                  p = p+1;
                }
               }
            });
        
        function get_more_comment(p){
           var id_target = "{$_GET['id']}";
          $.post("{:U('Video/get_more_comment')}",{
            pagenum:p,
            id_target:id_target
          },function(res){
            if(res.count>p){
              $("#pl_con").append(res.content)
            }else{
               $('.base-line').css('display','block');
              $('.loading').css('display','none')
              is_data=0
            }

          })
        }
        //获取跟多评论
        var currentVideoId = $('.header').find('.video>div').attr('id');
        var currentVideoPic = $('.header').find('.video>div').attr('pic');
        var currentVideoVideo = $('.header').find('.video>div').attr('video');
        var video_id = $('.header').find('.video>div').attr('video_id');
        var info_id = $('.header').find('.video>div').attr('info_id');
        console.log(currentVideoId)
        oldVideoId = currentVideoId;
        //  function playVideo(pic,video) {
        var videoId = 'ckplayer_a1'
        var clientWidth = document.documentElement.clientWidth;
        var videoHeight = clientWidth / 16 * 9;
        var flashvars = {
            i: currentVideoPic,
            c: 0,
            p: 1,
            loaded:'loadedHandler'
        };
        var video = [currentVideoVideo];
        CKobject.embed('ckplayer/ckplayer.swf', 'a1', videoId, '100%', videoHeight, false, flashvars, video);
        function loadedHandler(){
            CKobject.getObjectById('ckplayer_a1').addListener('ended',playHandler); 
            CKobject.getObjectById('ckplayer_a1').addListener('play',addplay);
        
        }
        function playHandler(){
            loop=false
        }

        function addplay(){
            //监听播放事件  添加播放量
            $('.aside_[id] li').eq(0).find('.click-num').html('<i class="iconfont icon-v"></i>')
                $.post("{:U('Video/play_count')}",{
                    id:video_id,
                    info_id:info_id,
                },function(res){
            })
        }
        /**
         *点赞
         */
function comment_praise(id,obj){
    $.post('{:U("Praise/ajax_praise")}',{
                id:id,
                video_id:id,
                type:3,
            },function(res){
              console.log(res)
               if(res.err==0){
                $(obj).attr('class','item-good')
                $(obj).find('img').attr('src','/App/Home/Public/images/comment-good.png')
                var num = $(obj).find('span').text()
                var n =parseInt(num)+1
                $(obj).find('span').text(n)
                var praise_count = parseInt($('#info_zan').find('span').text())+1

                $('#info_zan').find('span').html(praise_count)
                $('#b_peaise_num').text(praise_count)

               }else if(res.err==2){
                    layer.open({
                      content: res.msg
                      ,skin: 'msg'
                      ,time: 1
                      ,end:function(){location.href='/Home/user/login'}
                      });
               }else{
                    layer.open({
                      content: res.msg
                      ,skin: 'msg'
                      ,time: 1
                      });
               }
    })
}

 // $(window).scroll(function() {
 //      // var h = $('.tabs').offset().top- $(window).scrollTop()
 //     // console.log(h)
 //      if(h<0){
 //        $('.tabs').css('position','fixed');
 //      }
  
 //      if($(window).scrollTop() < $('.login').height()){
 //        $('.tabs').css('position','');
 //      }
 //    })
    </script>
  
</block>